<template>
	<view class="edit">
		<view class="edit_form">
			<view class="example">
				<!-- 基础用法，不包含校验规则 -->
				<uni-forms ref="formData" :modelValue="formData" :rules="rules">
					<uni-forms-item label="用户名" required name="name">
						<uni-easyinput type="text" v-model="formData.name" placeholder="请输入用户名">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="年龄" required name="age">
						<uni-easyinput type="text" maxlength="11" v-model="formData.age" placeholder="请输入年龄">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="手机号" name="iphone">
						<uni-easyinput type="number" maxlength="11" v-model="formData.iphone" placeholder="请输入手机号">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item required label="身份证号" name="idcards">
						<uni-easyinput type="number" v-model="formData.idcards" placeholder="请输入身份证号">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item required name="sex" label="性别">
						<uni-easyinput type="text" v-model="formData.sex" placeholder="请输入性别">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="address" label="地址">
						<uni-easyinput type="text" v-model="formData.address" placeholder="请输入地址">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="mark" label="备注">
						<uni-easyinput type="text" v-model="formData.mark" placeholder="请输入备注">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="xueli" label="学历">
						<uni-easyinput type="text" v-model="formData.xueli" placeholder="请输入学历">
						</uni-easyinput>
					</uni-forms-item>
					<button type="primary" size="mini" @click="submit('formData')">提交</button>
				</uni-forms>
			</view>
		</view>
		
	</view>
</template>

<script>
	import {
		webaddlist,
		webgetstudyinfo
	} from "../../wxapi/main.js"
	export default {
		data() {
			return {	
				id: "",
				total: null,
				newlist: null,
				formData: {
					xueli: "",
					name: "",
					age: "",
					iphone: "",
					idcards: "",
					sex: "",
					address: "",
					//备注
					mark: "",
				},
				rules: {
					name: {
						rules: [{
							required: true,
							errorMessage: '用户名不能为空'
						}]
					},
					sex: {
						rules: [{
							required: true,
							errorMessage: '性别不能为空'
						}]
					},
					idcards: {
						rules: [{
								required: true,
								errorMessage: '身份证号不能为空'
							},
							{
								// 使用正则表达式验证手机号长度为11位且均为数字
								pattern: /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12][0-9]|3[01])\d{3}([0-9]|X)$/,
								errorMessage: '身份证号需再次对照'
							}
						]
					},
					age: {
						rules: [{
								required: true,
								errorMessage: '年龄不能为空'
							},
							{
								// 假设原本的意图是检查密码是否全为数字，但根据常规密码策略这可能不太合理，
								// 通常密码会包含字母和数字等。这里仅按原需求展示，如需调整请告知。
								format: 'number',
								errorMessage: '年龄只能输入数字'
							}
						]
					}
				}
			}
		},
		onLoad(e) {
			console.log(e);
			this.id = e.id
			webgetstudyinfo({id:e.id}).then(res=>{
				console.log(res);
				this.formData.name = res.data.name
				this.formData.age = res.data.age
				this.formData.iphone = res.data.iphone
				this.formData.sex = res.data.sex
				this.formData.address = res.data.address
				this.formData.mark = res.data.mark
				this.formData.xueli = res.data.xueli
				this.formData.idcards = res.data.idcards
			})
		},
		methods: {
			//提交修改事件
			submit(ref) {
				this.$refs[ref].validate((err, value) => {
					if (!err) {
						let id = this.id
						webaddlist({
							id: id,
							name: this.formData.name,
							age: this.formData.age,
							iphone: this.formData.iphone,
							idcards: this.formData.idcards,
							sex: this.formData.sex,
							address: this.formData.address,
							mark: this.formData.mark,
							xueli: this.formData.xueli,
						}).then(res => {
							console.log(res);
							uni.switchTab({
								url: "/pages/info/info"
							})
						})

					}

				})

			}
		}
	}
</script>

<style scoped>
	.edit {
		box-sizing: border-box;
		padding: 25rpx;
	}
</style>